<!DOCTYPE html>
<html>
<head>
    <title>测试</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
          charset="UTF-8"/>

    <script type="text/javascript" src="../js/autoQR.js"></script>
    <script src="../js/HKNativeJSBridge.js"></script>
    <script src="../js/vconsole.min.js"></script>
    <script>
    // 初始化
    var vConsole = new VConsole();
    console.log('init vConsole');
    </script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .box {
            text-align: center;
        }

        .btn {
            line-height: 34px;
            text-align: center;
            font-size: 14px;
            border: 1px solid #a83939;
            background-color: #fff;
            margin-bottom: 20px;
            padding: 0 10px;
        }

        .message {
            position: fixed;
            bottom: 0;
            width: 100%;
            padding: 10px;
            font-size: 14px;
            color: #000;
        }

    </style>

</head>
<body>
<div class="box">
    <div class="message" id="message"></div>
    <button class="btn" onclick="testStore()">测试存储</button>
    <br/>
    <button class="btn" onclick="testRead()">测试读存储</button>
    <br/>
    <button class="btn" onclick="testDel()">测试删除存储</button>
    <br/>
    <button class="btn" onclick="testNewPage()">打开新页面push</button>
    <br/>
    <button class="btn" onclick="testNewPagePop()">打开新页面pop</button>
    <br/>
    <button class="btn" onclick="testNewOnLinePage()">打开在线新页面</button>
    <br/>
    <button class="btn" onclick="testDevice()">设备功能</button>
    <br/>
    <button class="btn" onclick="testStatusBar()">设置状态栏颜色1</button>
    <br/>
    <button class="btn" onclick="testStatusBar1()">设置状态栏颜色2</button>
    <br/>
    <button class="btn" onclick="testLog()">占位</button>
    <br/>
    <button class="btn" onclick="testLog()">占位</button>
    <br/>
    <button class="btn" onclick="testLog()">占位123</button>

    <br/>
</div>
<script>

function testRead() {

    hkNativeStore.get({key: "jsKey"}, readResult);
}

function testStore() {

    window.hkJSBridge.call({
        target: "Store",
        action: "save",
        data: {key: "jsKey", value: "jsstorecontent"},
        callback: function (jsonObj) {

            document.getElementById('message').innerHTML = jsonObj.status ? "store success" : "store fail";
        }
    });
}

function testDel() {

    hkNativeStore.del({key: "jsKey"}, null);
}

function testStatusBar() {

    window.hkJSBridge.call({
        target: "StatusBar",
        action: "color",
        data: {backColor: "#3061D9", titleColor: 1},
        callback: function (jsonObj) {

            document.getElementById('message').innerHTML = jsonObj.status ? "store success" : "store fail";
        }
    });
}

function testStatusBar1() {

    window.hkJSBridge.call({
        target: "StatusBar",
        action: "color",
        data: {backColor: "#FFFFFF", titleColor: 2},
        callback: function (jsonObj) {

            document.getElementById('message').innerHTML = jsonObj.status ? "store success" : "store fail";
        }
    });
}


function storeResult(result) {

    // console.log(typeof (result));

    document.getElementById('message').innerHTML = result.status ? "store success" : "store fail";

    // console.log("recv" + result);
}

function storeResult2(result) {

    console.log(typeof (result));

    // 字符串转化为Object
    // let obj = eval('(' + result + ')');

    // let obj = result;

    document.getElementById('message').innerHTML = result.status ? "store success" : "store fail";

    console.log("recv" + result);
}

function refreshFun(message) {

    console.log("refreshFun" + message);
}

function readResult(result) {

    // let obj = eval('(' + result + ')');
    // let obj = result;

    document.getElementById('message').innerHTML = result.status ? "get success:" + result.data : "get fail";

    console.log("recv" + result);
}

function testNewPage() {

    let data = {
        url: window.location.href.substring(0, window.location.href.lastIndexOf("/") + 1) + "h53.html",
        type: "push",
        navigationParams: {showNavigation: false}
    }

    hkNativePage.openPage(data, function (message) {

        document.getElementById('message').innerHTML = "new page info" + message;
    })
}

function testNewPagePop() {

    hkNativePage.openPage({
        url: window.location.href.substring(0, window.location.href.lastIndexOf("/") + 1) + "h53.html",
        type: "pop"
    }, function (message) {

        document.getElementById('message').innerHTML = "new page info" + message;
    })
}

function testNewOnLinePage() {

    hkNativePage.openPage({"url": "https://www.baidu.com"}, function (message) {

        document.getElementById('message').innerHTML = "new page info";
    })
}

function testDevice() {
    hkNativePage.openPage({
        url: window.location.href.substring(0, window.location.href.lastIndexOf("/") + 1) + "h5Device.html",
        style: "push"
    }, function (message) {

        document.getElementById('message').innerHTML = "new page info" + message;
    })
}

function testLog() {


    let pr = timeout(2000).then(function (val) {

        console.log('resolve timeout');

    }, function (err) {
        console.log('err timeout');
    }).catch(result => {
        console.log(result);
    });

    console.log('after');

    // testawait();
    // console.log('after testawain');
}

async function testawait() {

    let re = await timeout(2000);

    if (re)
        console.log(re);
    else {
        console.log('error');
    }
    //
    // try{
    //     //resolve
    //     let re = await timeout(2000);
    //     console.log(re);
    //
    // }catch (e) {
    //     //reject or exception
    //     console.log('err:'+e);
    //     return ;
    // }

    console.log('testawait');

    // console.log(re);
}

function timeout(ms) {
    return new Promise((resolve, reject) => {
        // setTimeout(resolve, ms, 'done');
        setTimeout(reject, ms, 'err');
    });
}

let ws = null;
let sendnums = 0;

function testws() {

    ws = new WebSocket('ws://localhost:3000/');


    // 打开一个 web socket  这里端口号和上面监听的需一致

    // Web Socket 已连接上，使用 send() 方法发送数据
    ws.onopen = function () {
        // 这里用一个延时器模拟事件
        setInterval(function () {
            if (ws.readyState === 1) {
                ws.send('客户端消息' + sendnums);
                sendnums++;
            }
        }, 2000);
    }
    // 这里接受服务器端发过来的消息
    ws.onmessage = function (e) {
        console.log(e.data)
    }
    ws.onclose = function (e) {

        console.log("Connection closed");

    }


}

function testclosews() {

    ws.close();
}

function testws1() {

    if (ws.readyState === 1) {
        ws.send('/nick' + 'nickName');
    }
}

function testws2() {

    if (ws.readyState === 1) {
        ws.send('/login' + 'login');
    }
}

</script>

</body>
</html>
